<template>
  <MyDialog title="Confirm QR Format" class="card-radius" :submit="onSubmit" :cancel="()=>$emit('cancel')">
    <q-card-section>
      <div class="row">
        <div class="col-6 q-my-sm fal">Scan Input:</div>
        <div class="col-6 q-my-sm">
          {{ qr_string }}
        </div>
      </div>
      <div class="row">
        <div class="col-6 q-my-sm fal">Stock Code:</div>
        {{ stock_code }}
      </div>
      <div class="row">
        <div class="col-6 q-my-sm fal">Serial No:</div>
        {{ serial_no }}
      </div>
    </q-card-section>
  </MyDialog>
</template>

<script setup lang="ts">
import { createQRMapping } from 'src/services/qrMapService';
import MyDialog from './container/MyDialog.vue';


const props = defineProps<{
  qr_string: string;
  stock_code: string
  serial_no: string
}>();

// const stock_code = ref('');
// const serial_no = ref('');

const emit = defineEmits(['onScanSuccess'])

async function onSubmit() {
    // if (props.qr_string==''||props.stock_code==''||props.serial_no==''){
    //     $q.notify({
    //         message: 'Check required fields',
    //         color: 'negative'
    //     })
    //     return
    // }
console.log(props);

  const res = await createQRMapping(props.qr_string, props.stock_code, props.serial_no)
    console.log(res.data);
    emit('onScanSuccess')
}

</script>

<style scoped></style>
